Skip to main content

File upload

Description

<jp-file-upload> is a component with functionality of <input type="file">, but also supports url links.


Attributes

NameRequiredTypeDescription
idstringunique identifier
valuestringsetter
labelstringlabel of the input field
labelType'outside' or 'inside'whether label is inside or outside of the field
serviceFileServicefile service
namestringname of the form control


Interfaces

FileService

Defines the accepted file types and provides a method to upload a file.



Properties
NameRequiredTypeDescription
acceptedFilesstringdefines acceptable file types
maxSizenumbermax file size in bytes
uploadFile(file: any, id?: string) => Promise<string>uploads a file and returns a promise
which is a string that represents a link to the file location


Slots

This component does not have any slots.



Methods

This component does not have any methods.



Events

  • getValue
    • returns form field value
  • value
    • triggers when value (file) changes
  • rejected
    • triggers when added file is not accepted because it does not satisfy some service criteria


Demo

Live Editor
// import '@jaspero/web-components/file-upload.wc.js';
// import '@jaspero/web-components/file-upload.css';

<jp-file-upload label="Upload a file"></jp-file-upload>
Result
Loading...